<template>
    <div class='pop' v-show="$parent.popflag">
        <div class='popson'>
            <v-classification :title='"会员信息"' :close='true' @popclose='popclose'></v-classification>
            <div class='pop_bottom'>
                <ul v-if='$parent.popdata'>
                    <li>
                        <p>账号：</p>
                        <p>{{$parent.popdata.tda}}</p>
                    </li>
                    <li>
                        <p>姓名：</p>
                        <p> {{$parent.popdata.tdb}}</p>
                    </li>
                    <li>
                        <p>电话号码：</p>
                        <p>{{$parent.popdata.tdg}}</p>
                    </li>
                    <li>
                        <p>个人级别：</p>
                        <p>{{$parent.popdata.tdc}}</p>
                    </li>
                    <li>
                        <p>团队级别：</p>
                        <p>{{$parent.popdata.tdd}}</p>
                    </li>
                    <li>
                        <p>个人业绩：</p>
                        <p> {{$parent.popdata.tde}}</p>
                    </li>
                    <li>
                        <p>团队业绩：</p>
                        <p>{{$parent.popdata.tdy}}</p>
                    </li>
                    <li>
                        <p>部门业绩：</p>
                        <p>{{$parent.popdata.tdz}}</p>
                    </li>
                    <li>
                        <p>注册时间：</p>
                        <p style="width: 300px;">{{$parent.popdata.tdt}}</p>
                    </li>
                    <li>
                        <p>状态：</p>
                        <p>{{$parent.popdata.tdf}}</p>
                    </li>
                </ul>
            </div>
        </div>

    </div>
</template>

<script>
import classification from "../common/classification.vue";
export default {
  methods: {
    popclose(flag) {
        this.$parent.popflag = flag;
    }
  },
  mounted() {},
  components: {
    "v-classification": classification
  },
  data() {
    return {
      msg: "Welcome to Your Vue.js App"
    };
  },

  props: ["flag"]
};
</script>

<style lang="less" scoped>
.pop {
  position: fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.65);
  z-index: 100;
  > .popson {
    height: 424px;
    width: 480px;
    background-color: white;
    position: fixed;
    z-index: 101;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    > .pop_bottom {
      > ul {
        padding-top: 8px;
        > li {
          display: flex;
          padding: 8px 0px;
          padding-left: 20px;
          p {
            font-size: 14px;
          }
          p:first-child {
            width: 20%;
            color: #30383e;
          }
          p:last-child {
            width: 20%;
            color: #666;
          }
        }
      }
    }
  }
}
</style>
